import { getSelectionText } from "@/js/selection/selection.js";
import { NoteScope } from "@js/constants.js";

function findParentSent(span) {
  if (span.nodeType == 3) {
    span = span.parentNode;
  }
  if (span.classList.contains("line")) {
    return span;
  } else {
    let parent = span.parentNode;
    while (!parent.classList.contains("line")) {
      parent = parent.parentNode;
    }
    return parent;
  }
}

export function getWordSelection() {
  let sel = window.getSelection();
  let startspan = sel.anchorNode;
  let endspan = sel.focusNode;
  if (startspan == endspan) {
    let line = findParentSent(startspan);
    // 正好在同一个span中
    let senttext = line.textContent;
    let seltext = sel.toString();
    let spos = senttext.indexOf(seltext);
    return {
      el: line,
      spos: spos,
      epos: spos + seltext.length,
      text: seltext,
    };
  } else {
    // 需要找寻共同的祖先节点。
    let startSent = this.findParentSent(startspan);
    let endSent = this.findParentSent(endspan);
    console.log("parents:", startSent, endSent);
    if (startSent == null || endSent == null || startSent != endSent) {
      // TODO: 用更合适的形式来避免跨句选择。
      console.log("暂不支持跨句笔记！请重新选择一句话之内的词语！");
      return {
        el: sel.anchorNode,
        spos: 0,
        epos: 0,
        text: "",
      };
    } else {
      let line = startSent.textContent;
      let seltext = sel.toString();
      let spos = line.indexOf(seltext);
      return {
        el: line,
        spos: spos,
        epos: spos + seltext.length,
        text: seltext,
      };
    }
  }
}

export function getNoteSelection(noteSpan) {
  let lineSpan = noteSpan.parentElement;
  let sel = {};
  let len = 0;
  for (let node of lineSpan.childNodes) {
    console.log("node:", node)
    sel.spos = len;
    len += node.textContent.length;
    sel.epos = len;
    if (node === noteSpan) {
      break;
    }
  }
  if (noteSpan.classList.contains("pinyin")) {
    sel.text = noteSpan.firstChild.textContent;
  } else {
    sel.text = noteSpan.textContent;
  }
  return sel;
}

export function addClickListener(vm, lineSpan) {
  let linenum = Number(lineSpan.getAttribute("linenum")) || 0;
  let mid = vm.$route.params.mid;
  lineSpan.onclick = (event) => {
    let sel = {};
    if (event.target !== lineSpan) {
      // 内部元素，比如单词注释等
      let tgt = event.target;
      let clazz = tgt.classList;
      if (clazz.contains("note") || clazz.contains("pinyin")) {
        let notesel = getNoteSelection(tgt);
        sel = {
          scope: notesel.text.length > 1 ? NoteScope.Word : NoteScope.Char,
          content: notesel.text,
          el: tgt,
          event: event,
          line: Number(linenum),
          s: {
            mid: mid,
            line: linenum,
            pos: notesel.spos
          },
          e: {
            mid: mid,
            line: linenum,
            pos: notesel.epos
          }
        };
      }
    } else {
      let selectedText = getSelectionText();
      // TODO：处理跨句选择转化为多个完整句子的情形。
      let s = {
            mid: mid,
            line: linenum,
            pos: 0
          };
      let e = {
            mid: mid,
            line: linenum,
            pos: selectedText.length
      };
      if (selectedText) {
        let wordsel = getWordSelection();
        s.pos = wordsel.spos;
        e.pos = wordsel.epos;
        // 如果是选择一段文字，这里只支持单句之内的选择，如单词、单字等，跨句的情况不作考虑，当跨句时，应当转化为多句选择。
        sel = {
          scope: NoteScope.Word,
          content: wordsel.text,
          el: lineSpan,
          event: event,
          line: linenum,
          s: s,
          e: e
        };
      } else {
        // 如果只是单选一行
        sel = {
          scope: NoteScope.Line,
          content: lineSpan.origText || lineSpan.textContent,
          el: lineSpan,
          event: event,
          line: linenum,
          s: s,
          e: e
        };
      }
    }
    console.log("selection: ", sel)
    vm.$emit("select", sel);
  };
}